<template>
	<div id="Details">
		<div class="top">

		</div>
		<div class="content">
			<ul class="left">
				<li v-for="item in 10"></li>
			</ul>
			<div class="right">
				<ul>
					<li v-for="item in 3">
						<div class="h3">

						</div>
						<ol>
							<li v-for="item in 6"></li>
						</ol>
					</li>
				</ul>
			</div>
		</div>
	</div>
</template>

<script>
</script>

<style lang="scss" scoped>
	#Details {
		width: 100vw;

		.top {
			width: 94%;
			height: 30px;
			margin: 15px auto;
			background-color: #f5f7f8;
		}

		.content {
			width: 94%;
			display: flex;
			margin: 15px auto;
			justify-content: space-between;

			.left {
				li {
					width: 80px;
					height: 20px;
					background-color: #f5f7f8;
					margin: 40px 0;
				}
			}

			.right {
				width: 65%;

				ul {
					li {
						.h3 {
							width: 70px;
							height: 20px;
							background-color: #f5f7f8;
							margin: 40px 0;
						}

						ol {
							display: flex;
							flex-wrap: wrap;
							justify-content: space-between;
						}

						li {
							width: 60px;
							height: 60px;
							background-color: #f5f7f8;
							margin-bottom: 10px;
						}
					}
				}
			}
		}
	}
</style>
